<div class="container" [hidden]="!showup" [@showup]="showup">
    <p-growl [value]="message"></p-growl>
    <div class="login">
        <form [formGroup]="form" novalidate style="max-width:600px" (submit)="login()">
            <div class="form">
                <h2>
                    请登录
                </h2>
                <div class="ui-grid-row">
                    <div class="ui-grid-col-2">
                        <label for="name">用户名</label>
                    </div>
                    <div class="ui-grid-col-10">
                        <input type="text" class="form-control" formControlName="name" pInputText isNotNull>
                        <div class="error-tip" [innerHTML]="form.controls.name | validators">
                        </div>
                    </div>
                </div>

                <div class="ui-grid-row">
                    <div class="ui-grid-col-2">
                        <label for="password">密码</label>
                    </div>
                    <div class="ui-grid-col-10">
                        <input type="text" class="form-control" formControlName="password" pInputText isNotNull>
                        <div class="error-tip" [innerHTML]="form.controls.password | validators">
                        </div>
                    </div>
                </div>

                <div class="ui-grid-row">
                    <div class="ui-grid-col-2">
                        <label for="code">验证码</label>
                    </div>
                    <div class="ui-grid-col-10">
                        <input type="text" class="form-control" formControlName="code" pInputText>
                        <div class="error-tip" [innerHTML]="form.controls.code | validators">
                        </div>
                    </div>
                </div>
            </div>
            <div class="action">
                <button pButton type="submit" label="登录"></button>
            </div>
        </form>
    </div>
</div>